import React, { ClassAttributes, CSSProperties, FC, InputHTMLAttributes } from 'react';
import * as allIcons from '@ant-design/icons';

const antIcon: { [key: string]: any } = allIcons;

export type IconType = string;
type MyIconType = {
  name: IconType;
  style?: CSSProperties | undefined;
  className?: string;
  fontSize?: string;
  props?:
    | (InputHTMLAttributes<HTMLInputElement> & ClassAttributes<HTMLInputElement>)
    | null
    | undefined;
};
const MyIcon: FC<MyIconType> = ({
  name = 'SmileOutlined',
  style,
  className = 'text-[14px]',
  fontSize,
  props,
}) => {
  let key = name;
  if (!antIcon[key]) {
    key = 'SmileOutlined';
  }
  const dom = antIcon[key];
  return React.createElement(dom, {
    style: {
      fontSize,
      ...style,
    },
    className: className,
    ...props,
  });
};

export default MyIcon;
